<title>商品分类</title>

<div class="layui-fluid">
    <table id="category-list" class="layui-table ex-table" lay-filter="category-list"></table>
</div>

<script type="text/html" id="category-toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm save" data-title="添加分类" data-url="/category/save"> 添加分类 </button>
    </div>
</script>
<!-- 操作列 -->
<script type="text/html" id="category-state">
    <a class="layui-btn layui-btn-primary layui-btn-xs save" data-title="编辑分类" data-url="/category/save" data-id='{{ d.id }}'>修改</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs delete" data-url="admin/category/delete/id/{{ d.id }}">删除</a>
</script>

<script>
    layui.extend({
		treetable: 'lay-module/treetable-lay/treetable',
	}).use(['table', 'treetable'], function () {
        var $ = layui.jquery;
        var table = layui.table;
        var treetable = layui.treetable;

        // 渲染表格
        layer.load(2);
        treetable.render({
            treeColIndex: 1,
            treeSpid: 0,
            treeIdName: 'id',
            treePidName: 'pid',
            elem: '#category-list',
            toolbar: '#category-toolbar',
            url: layui.setter.API_HOST + '/admin/category/index',
            page: false,
            cols: [[
                {type: 'numbers'},
                {field: 'title', width: 320, title: '分类名称'},
				{field: '', width: 100, title: '分类图片', templet: function(d) {
					if(d.min_image) {
						return '<img src="'+ d.min_image +'" style="max-width:50px; max-height:50px;" />'
					}
					return '';
				}},
                {field: '', width: 120, align: 'center', templet: function (d) {
                        if (d.level == 1) {
                            return '<span class="layui-badge layui-bg-blue">一级分类</span>';
                        } else if (d.level == 2) {
                            return '<span class="layui-badge layui-bg-cyan">二级分类</span>';
                        } else {
                            return '<span class="layui-badge-rim">三级分类</span>';
                        }
                    }, title: '类型'
                },
                {templet: '#category-state', title: '操作'}
            ]],
            done: function (res) {
				console.log(res);
                layer.closeAll('loading');
            }
        });
    });
</script>
